<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <script type="text/javascript">
    window.onload = function(){
      let loginbtn = document.getElementById('login');
      let userTxt = document.getElementById('username');
      let passTxt = document.getElementById('pass');

      loginbtn.onclick = function(){
        let form = new FormData();
        form.set('username',userTxt.value);
        form.set('password',passTxt.value);
        let xhr = new XMLHttpRequest();
        xhr.open('POST','http://localhost:8080',true);
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        xhr.send(form);
        xhr.onreadystatechange = function(){
          if(xhr.readyState==4){
            if((xhr.status>200&&xhr.status<300)||xhr.status==304){
              alert('成功');
            }else{
              alert('失败');
            }
          }
        }
      }
    }
  </script>
</head>
<body>
  <input type="text" id='username'/><br>
  <input type="password" id='pass'/><br>
  <input type="button" id="login" value="登录">
</body>
</html>
